<%@ include file="/common/taglibs.jsp"%>
<%@ page language="java" import="java.util.*" pageEncoding="utf8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US" lang="en-US"
	dir="ltr">
	<head>

		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<link rel="stylesheet" href="<c:url value="/css/shopadmin.css"/>"
			type="text/css" />


	</head>
	<body style="">
		<div class="head_content" id="headBar" style=""></div>
		<div class="main_content" id="main">

			
			<form action="sys_setting_batchSave.html" method="post"
				class="settingform" id="image_form"  >
				<input name="redirect" value="sys_setting_image" type="hidden">
				<div class="tableform notice">
					一张商品图片上传后，会自动生成三张图片，分别出现在商店的三类页面，如下：
					<br />
					1：显示在商品列表页、首页商品版块内的图片，我们称为“列表页缩略图”；
					<br />
					2：显示在商品详细页内的图片，我们称为“商品页详细图”；
					<br />
					3：显示在商品相册页内的图片，我们称为“商品相册图”；
				</div>
				<div class="tableform">
					<table width="100%" cellspacing="0" cellpadding="0" border="0">
						<tbody>
							<tr>
								<td>
									<h4>
										三种图片尺寸设定
									</h4>
								</td>
								<td style="text-align: right; padding-right: 10px;">
									&nbsp;
								</td>
							</tr>
						</tbody>
					</table>
					<div class="division">
						<table cellspacing="0" cellpadding="0" border="0">
							<tbody>
								<tr>
									<th>
										商品相册图 宽度：
									</th>
									<td  >
										<input value="${goodsImageParameter.bigPicWidth.name}"
											name="systemSettingss[0].name" type="hidden" />
										<input class="x-input "
											value="${goodsImageParameter.bigPicWidth.data}"
											name="systemSettingss[0].data" type="text" />
										&nbsp; 高度：&nbsp;
										<input value="${goodsImageParameter.bigPicHeight.name}"
											name="systemSettingss[1].name" type="hidden" />
										<input class="x-input "
											value="${goodsImageParameter.bigPicHeight.data}"
											name="systemSettingss[1].data" type="text" />
									</td>
								</tr>
								<tr>
									<th>
										商品页详细图 宽度：
									</th>
									<td>
										<input value="${goodsImageParameter.middlePicWidth.name}"
											name="systemSettingss[2].name" type="hidden" />
										<input class="x-input "
											value="${goodsImageParameter.middlePicWidth.data}"
											name="systemSettingss[2].data" type="text" />
										&nbsp; 高度：&nbsp;
										<input value="${goodsImageParameter.middlePicHeight.name}"
											name="systemSettingss[3].name" type="hidden" />
										<input class="x-input "
											value="${goodsImageParameter.middlePicHeight.data}"
											name="systemSettingss[3].data" type="text" />

									</td>
								</tr>
								<tr>
									<th>
										列表页缩略图 宽度：
									</th>
									<td>
										<input value="${goodsImageParameter.smallPicWidth.name}"
											name="systemSettingss[4].name" type="hidden" />
										<input class="x-input "
											value="${goodsImageParameter.smallPicWidth.data}"
											name="systemSettingss[4].data" type="text" />
										&nbsp; 高度：&nbsp;
										<input value="${goodsImageParameter.smallPicHeight.name}"
											name="systemSettingss[5].name" type="hidden" />
										<input class="x-input "
											value="${goodsImageParameter.smallPicHeight.data}"
											name="systemSettingss[5].data" type="text" />
									</td>
								</tr>
							</tbody>
						</table>
					</div>
					<span class="notice-inline">注意：如果尺寸设置为0，则显示商品图片原始尺寸。</span>
					<br />
					<br />
					<h4>
						商品规格图片尺寸设置
					</h4>
					<div class="division">
						<table cellspacing="0" border="0">
							<tbody>
								<tr>
									<th>
										宽度：
									</th>
									<td>
										<input value="${goodsImageParameter.specPicWidth.name}"
											name="systemSettingss[6].name" type="hidden" />
										<input class="x-input "
											value="${goodsImageParameter.specPicWidth.data}"
											name="systemSettingss[6].data" type="text" />
									</td>
									<th>
										高度：
									</th>
									<td>
										<input value="${goodsImageParameter.specPicHeight.name}"
											name="systemSettingss[7].name" type="hidden" />
										<input class="x-input "
											value="${goodsImageParameter.specPicHeight.data}"
											name="systemSettingss[7].data" type="text" />
									</td>

								</tr>
							</tbody>
						</table>
					</div>
				</div>


				<div class="tableform">
					<table width="100%" cellspacing="0" cellpadding="0" border="0">
						<tbody>
							<tr>
								<td>
									<h4>
										FTP设置
									</h4>
								</td>
								<td style="text-align: right; padding-right: 10px;">
									&nbsp;
								</td>
							</tr>
						</tbody>
					</table>
					<div class="division">
						<table cellspacing="0" border="0">
							<tbody>
								<tr>
									<th>
										 是否使用FTP存储图片
									</th>
									<td>
										<input value="${goodsImageParameter.ftpUsed.name}"
											name="systemSettingss[8].name" type="hidden" />
										<input class="x-input "  onclick="ftpChange(true)"
											value="true"  id="ftp_used"
											name="systemSettingss[8].data" type="radio" />
										<input class="x-input "  onclick="ftpChange(false)"
											value="false"  id="ftp_unused"
											name="systemSettingss[8].data" type="radio" />
									</td> 

								</tr>
							</tbody>
						</table>
					</div>
					<div class="division"  id="ftp_detail"  style="display:none">
						<table cellspacing="0" cellpadding="0" border="0">
							<tbody>
								<tr>
									<th>
										ftp用户名：
									</th>
									<td  >
										<input value="${goodsImageParameter.ftpUserName.name}"
											name="systemSettingss[9].name" type="hidden" />
										<input class="x-input "
											value="${goodsImageParameter.ftpUserName.data}"
											name="systemSettingss[9].data" type="text" /> 
									</td>
								</tr>
								<tr>
									<th>
										FTP密码：
									</th>
									<td>
										<input value="${goodsImageParameter.ftpUserPassword.name}"
											name="systemSettingss[10].name" type="hidden" />
										<input class="x-input "
											value="${goodsImageParameter.ftpUserPassword.data}"
											name="systemSettingss[10].data" type="text" /> 

									</td>
								</tr>
								<tr>
									<th>
										FTP远程IP：
									</th>
									<td>
										<input value="${goodsImageParameter.ftpIp.name}"
											name="systemSettingss[11].name" type="hidden" />
										<input class="x-input "
											value="${goodsImageParameter.ftpIp.data}"
											name="systemSettingss[11].data" type="text" /> 
									</td>
								</tr>
								<tr>
									<th>
										FTP远程端口：
									</th>
									<td>
										<input value="${goodsImageParameter.ftpPort.name}"
											name="systemSettingss[12].name" type="hidden" />
										<input class="x-input "
											value="${goodsImageParameter.ftpPort.data}"
											name="systemSettingss[12].data" type="text" /> 
									</td>
								</tr>
								<tr>
									<th>
										FTP远程文件路径：
									</th>
									<td>
										<input value="${goodsImageParameter.ftpPath.name}"
											name="systemSettingss[13].name" type="hidden" />
										<input class="x-input "
											value="${goodsImageParameter.ftpPath.data}"
											name="systemSettingss[13].data" type="text" /> 
									</td>
								</tr>
								<tr>
									<th>
										远程图片服务器URL：
									</th>
									<td>
										<input value="${goodsImageParameter.ftpImageRemotePath.name}"
											name="systemSettingss[14].name" type="hidden" />
										<input class="x-input "  style="width:300px;"
											value="${goodsImageParameter.ftpImageRemotePath.data}"
											name="systemSettingss[14].data" type="text" /> 如http://image.xxx.com/
									</td>
								</tr>
							</tbody>
						</table>
					</div>
					 
					
				</div>
				<div class="tableform">
					<div class="table-action">
						<button class="btn" type="submit">
							<span><span>保存</span> </span>
						</button>
					</div>
				</div>

			</form>

		</div>
		<div class="foot_content" id="footBar" style="font-size: 0px;"></div>
		<script type="text/javascript"
			src="<c:url value='/scripts/jquery-1.4.2.js'/>"></script>
		<script type="text/javascript"
			src="<c:url value='/scripts/jquery.validate.js'/>"></script>
		<script type="text/javascript">
		
		var ftpUsed = ${goodsImageParameter.ftpUsed.data};
		if(ftpUsed){
			$('#ftp_used').attr('checked',true);
		}else{
			$('#ftp_unused').attr('checked',true);
		}
		ftpChange(ftpUsed);
		function ftpChange(use){
			if(use){
				$('#ftp_detail').css('display','');
			
			}else{
				$('#ftp_detail').css('display','none');
			}
		
		}
		
		
	$(document).ready(function() {
		var validator = $("#image_form").validate( {
			errorElement : "div",
			errorClass : "x-vali-error",
			onfocusout : false,
			rules : {
				'systemSettingss[0].data' : "required",

				'systemSettingss1[1].data' : {
					required : true,
					url : true
				},
				'systemSettingss[2].data' : "required",
				'systemSettingss[3].data' : {
					required : true,
					number : true
				}
			},
			messages : {
				'systemSettingss[0].data' : "必填字段",

				'systemSettingss1[1].data' : {
					required : "必填字段",
					url : "请填入链接格式 http://aaa.bbb.com"
				},
				'systemSettingss[2].data' : "必填字段",
				'systemSettingss[3].data' : {
					required : "必填字段",
					number : "请输入数字"
				}
			},
			errorPlacement : function(error, element) {
				element.removeClass('x-vali-error');
				error.appendTo(element.parent());

			},

			success : function(div) {
				$(div).remove();
			}
		});
	});
</script>

	</body>
</html>